<template>
		<div class="wrap-case-detail">
			<div class="detail-nav-title">
				<router-link tag='a' :to="'/index'" >首页</router-link> >
				<router-link tag='a' :to="'/design'">设计师</router-link>>
				<a>{{detail.name}}</a>
			</div>
			<div class="detail-head">
				<div class="detail-headdesign-left">
					<img :src="detail.image" alt="">
				</div>
				<div class="detail-head-right">
					<h2>{{detail.name}}</h2>
					<p>年龄：{{detail.age}}</p>
					<p>设计经验：{{detail.experience}}</p>
					<p>设计理念：{{detail.describe}}</p>
				</div>
			</div>
			<div class="detail-box">
				<div class="detail-box-pub">
					<h1>设计方案</h1>
					<div class="wrap-imgcase2">
						<div class="imgcase-box" v-for="(item, index) in detail.items" :key="index" @click="$axios.goCase(item.schemeIndex)">
							<div class="cb-img">
								<img :src="item.image">
							</div>
							<div class="cd-text">
								<span class="cb-title">{{item.title}}</span>
								<span class="cb-sum">{{item.imageCount}}张</span>
							</div>
						</div>
						<div class="clear"></div>
					</div>
				</div>
				<div class="page" style="text-align:center;margin-top:20px;" v-if="total >= pagelimit">
      		<el-pagination
      		  background
      		  layout="prev, pager, next"
      		  @current-change="handleCurrentChange"
      		  :page-size="pagelimit"
      		  :total="total">
      		</el-pagination>
    		</div>
			</div>
		</div>
</template>

<script>
export default {
  data () {
    return {
    	detail: [],
    	pageindex: 0,
    	pagelimit: 3,
    	total: ''
    }
  },
  methods: {
  	getQuery () {
  		var that = this
  		var id = that.$route.query.id
  		if (id) {
  			that.$axios.request('/CompanyDesigner/Detail', {
  				DesignerIndex: id,
  				Pageindex: that.pageindex,
  				Pagelimit: that.pagelimit
  			})
  				.then((res) => {
  					if (res.code === 0) {
  						that.detail = res.data.dataList
  						that.total = res.data.total
  					}
  				})
  		} else {
  			that.$router.push({
  				name: 'design'
  			})
  		}
  	},
  	handleCurrentChange (val) {
      var that = this
      that.pageindex = val
      that.getQuery()
    },
  },
  mounted () {
  	this.getQuery()
  }
}
</script>
